<template>
	<view class="content">
		<view class="btn feiyong">
			<text>{{number/100}}元</text>
		</view>
		<button @click="payHandler" class="pay-btn" type="primary">
			<view class="iconfont iconweixin"></view>
			<text class="title">微信支付</text>
		</button>
		<!-- <view class="btn">
			<button @click="back" >返回</button>
			<button @click="go">继续</button>
			<view class="text">
				如已完成支付，请点击"继续"参加考试
			</view>
		</view> -->
	</view>
</template>

<script>
	import {wxpay,paystatus} from '../../apis'
	export default {
		data() {
			return {
				id:0,
				// title:'',
				// startTime:0,
				// leave:0,
				number:0,
				// flag:true
			}
		},
		onLoad(option) {
			console.log(option)
			this.id = option.id
			// this.title = option.title
			// this.startTime = option.startTime
			// this.leave = option.leave
			this.number = option.number
			// paystatus({
			// 	"examId":this.id
			// }).then((res)=>{
			// 	let [err,data]=res
			// 	if(data.data.data == "已支付"){
			// 		this.flag = false
			// 	}
			// })
		},
		methods: {
			// back(){
			// 	uni.navigateBack({
			// 	    delta: 1
			// 	});
			// },
			// go(){
			// 	paystatus({
			// 		"examId":this.id
			// 	}).then((res)=>{
			// 		let [err,data]=res
			// 		console.log(data)
			// 		if(data.data.data == "未支付"){
			// 			uni.showToast({
			// 				title:'请先报名付费！',
			// 				image:'../../static/gantan.png'
			// 			})
			// 		}else{
			// 			uni.redirectTo({
			// 			    url: '../answer/answer?id='+this.id+'&title='+this.title+'&startTime='+this.startTime+'&leave='+this.leave
			// 			});
			// 		}
			// 	})
			// },
			// 支付按钮点击方法
			payHandler () {
				wxpay({
					examId :this.id
				}).then((res)=>{
					let [err,data] = res
					if(err!=null){
						// console.log(err)
						uni.showToast({
							title:'您的网络开小差啦！',
							icon:'none'
						})
					}
					console.log(data)
					if(data.data.code==200){
						console.log(data.data.data);
						uni.requestPayment({
							provider: 'wxpay',
							orderInfo: 'asfsdfvsdf', // 订单数据
							timeStamp: data.data.data.timeStamp, // 时间戳从1970年1月1日至今的秒数，即当前的时间
							nonceStr: data.data.data.nonceStr, // 随机字符串，长度为32个字符以下
							package: data.data.data.package, // 统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=xx
							signType: data.data.data.signType, //签名算法，暂支持 MD5
							paySign: data.data.data.paySign, // 签名
							success: function (res) {
								// 完成支付后直接跳转到grade页面
								uni.switchTab({
									url:'../grade/grade'
								})
							},
							fail: function (err) {
								// 支付失败的回调中 用户未付款
								uni.showToast({
									title: '支付取消',
									image: '../../static/gantan.png'
								});
							}
						});
						
					}else{
						console.log('返回结果不是200')
						uni.showToast({
							title:data.data.message,
							image:'../../static/gantan.png'
						})
					}
				})
				
			}
		}
	}
</script>

<style lang="scss">
	.content {
		position: absolute;
		top: 0upx;
		left: 0upx;
		bottom: 0upx;
		right: 0upx;
		display: flex;
		align-items: center;
		justify-content: center;
		
		.pay-btn {
			/*  #ifdef  MP-WEIXIN  */
			background-color: #86db48;
			/*  #endif  */
			width: 600upx;
			height: 90upx;
			border-radius: 45upx;
			display: flex;
			justify-content: center;
			align-items: center;
			
			.title {
				font-size: 18px;
				color: #fff;
				margin-left: 20upx;
			}
			
			.iconfont {
				color: #fff;
			}
		}
		.btn{
			width: 100%;
			height: 94px;
			position: absolute;
			margin-top: 190px;
			text-align: center;
			button{
				background-color: #86db48;
				width: 15%;
				font-size: 12px;
				display: inline-block;
				margin: 10px 60px;
				color: #fff;
			}
			.text{
				font-size: 10px;
				color: red;
				font-weight: 700;
			}
		}
		.feiyong{
			width: 40%;
			height: 150px;
			background: url(../../static/qian.png);
			margin-top: -200px;
			background-size: 79%;
			background-repeat: no-repeat;
			background-position-x: 20px;
			text{
				display: inline-block;
				position: fixed;
				margin-top: 140px;
				margin-left: -32px;
				color: #f8845d;
				font-weight: 900;
				font-size: 30px;

			}
		}
	}
	
</style>
